

<form class="form-horizontal" id="ae_form" action="/pg/ac_Rilevazioni/Create" method=POST enctype=multipart/form-data role="form">
    <fieldset>
<input type="hidden" name="id" value="{{pageData['dao'].id}}"/>
<div class="form-group">
    <label class="col-sm-2 col-lg-2 control-label" for="id_ente" >Seleziona un Ente da inserire/modificare</label>
    <div class="col-sm-5 col-lg-5">
        <select id="id_ente" name="id_ente" class="validate[required]">
<!--
            <option value=""></option>
-->
            {% for t in pageData['enti'] %}
                <option value="{{t.id}}" {{ 'selected="selected"' if t.id == pageData["dao"].id_ente}}  >{{t.denominazione}} </option>
            {% endfor %}
        </select>
    </div>
</div>
<div class="form-group">
    <label class="col-sm-2 col-lg-2 control-label" for="id_operatore" >Seleziona un Operatore/Cliente</label>
    <div class="col-sm-5 col-lg-5">
        <select id="id_operatore" name="id_operatore" class="validate[required]">
            {% for t in pageData['operatori'] %}
                <option value="{{t.id}}" {{ 'selected="selected"' if t.id == pageData["dao"].id_operatore}}  >{{t.cognome + " " + t.nome}} </option>
            {% endfor %}
        </select>
    </div>
</div>
<div class="form-group">
    <label class="col-sm-2 col-lg-2 control-label" for="id_categoria" >Seleziona una Categoria da inserire/modificare</label>
    <div class="col-sm-5 col-lg-5">
        <select id="id_categoria" name="id_categoria" class="validate[required]">
        </select>
    </div>
</div>
<div id="tabs">
    <ul>
        <li><a href="#tabs-1" title="">Campi</a></li>
    </ul>
    <div id="tabs-1">
        <div class="form-group">
        <div class="col-sm-12 col-lg-12" >
            <div id = "generic"></div>
        </div>
    </div>

<div class="form-group" title="Bottoni di salvataggio e reset del form">
        <div class="col-sm-5 col-lg-5 col-sm-offset-2">
            <input class="btn btn-default" type="submit" value="Salva" name="add"/>
            <input class="btn btn-default" type="button" value="Chiudi" name="chiudi" id="chiudi_edit"/>
        </div>
    </div>
</div>

</fieldset>
</form>
</div>
<script>
  $(document).ready(function(){

$( "#ae_form" ).validationEngine({
                    prettySelect : true,
                    useSuffix: "_chosen",
                });
$( "#id_operatore" ).chosen({ width: "50%"})
$( "#id_ente" ).chosen({ width: "50%", allow_single_deselect: true}).change(function (e) {
    var id_ente = $("#id_ente").find("option:selected").val();
    {% if pageData["dao"].id_categoria %}
        var id_categoria_edit = {{pageData["dao"].id_categoria}}
    {% else %}
        var id_categoria_edit = false
    {% endif %}

    if (id_categoria_edit!==false){
        options = '<option value="' + id_categoria_edit + '">' + '{{pageData["dao"].categoria}}' + '</option>';
         $("#id_categoria").html(options);
         $("#id_categoria").trigger("chosen:updated");
    } else {
       $.getJSON("/pg/ac_Rilevazioni/GetCate",{id_ente:id_ente}, function(data){
        var options = "<option value="+"></option>"
         $.each( data, function( k, v ){
           options += '<option value="' + v.id + '">' + v.denominazione + '</option>';
         });
         $("#id_categoria").html(options);
         $("#id_categoria").trigger("chosen:updated");
         //$( "#id_categoria" ).trigger( "change" )

        });
    }
});

$( "#id_ente" ).trigger( "change" )
$( "#tabs" ).tabs();
$('.fileinput').fileinput()
$("#id_categoria").chosen({ width: "50%",
                allow_single_deselect: true})

$("#id_categoria").change(function (e) {
    {% if pageData["dao"].objson %}
        objson = {{pageData["dao"].objson}}
        console.log(objson[0]["Ente"]);
    {% else %}
        var objson = [0]
    {% endif %}

    var id_categoria = $("#id_categoria").find("option:selected").val();
   $.getJSON("/pg/cu_CategoriaCampo/GetCategoriaCampo",{id_categoria:id_categoria}, function(data){
    var lis = ""
    $.each( data, function( k, v ){
    if (v.required == "true"){
        required = "validate[required]"
    } else {
        required = ""
    };
    if (objson[0][v.denominazione] != undefined){
            if (v.tipo_campo==="img" || v.tipo_campo==="firm" ) {
                value = objson[0][v.denominazione]
                if (value != "") {
                    cla = "fileinput-exists"
                    } else {
                        cla= "fileinput-new"
                        }

            } else {
                value = "value="+'"'+objson[0][v.denominazione].replace(/\\/g, '')+'"'
            }
    }else{
        value =""
        cla = "fileinput-new"
    }
    //console.log(v.tipo_campo)
    var divv = v.denominazione //.replace(/ /g,'_');
    if (v.tipo_campo ==="date") {
        lis += '<div class="form-group" title=""><label class="col-sm-3 col-lg-3 control-label" for="'+divv+'">'+v.denominazione+':</label><div class="col-sm-5 col-lg-5"><input class="datapi form-control-static'+required+'"  '+  value +' type="text" name="'+divv+'" id="'+divv+'"/></div></div>'
    } else if (v.tipo_campo==="checkbox"){
        lis += '<div class="form-group" title=""><label class="col-sm-3 col-lg-3 control-label" for="'+divv+'">'+v.denominazione+':</label><div class="col-sm-5 col-lg-5"><input class="form-control-static '+required+'" '+ value +' type="'+v.tipo_campo+'" name="'+divv+'" id="'+divv+'"/></div></div>'
    }else if (v.tipo_campo==="img" || v.tipo_campo==="firm"){
        lis += '<div class="form-group" title="">\
                    <label class="col-sm-3 col-lg-3 control-label" for="'+divv+'">'+v.denominazione+':</label>\
                <div class="col-sm-7 col-lg-7">\
                <div class="fileinput '+cla+' " data-provides="fileinput">\
                    <div class="fileinput-preview thumbnail" data-trigger="fileinput" style="width: 200px; height: 150px;">\
                        <img class="img-thumbnail img-responsive" src="data:image/png;base64,'+value+'" alt="'+v.denominazione+'"  />\
                    </div>\
                    <div>\
                        <span class="btn btn-danger btn-file">\
                            <span class="fileinput-new">Seleziona immagine</span>\
                            <span class="fileinput-exists">Cambia</span>\
                                <input class="" type="file" name="'+divv+'" id="'+divv+'">\
                        </span>\
                            <a href="#" class="btn btn-info fileinput-exists" data-dismiss="fileinput">Rimuovi</a>\
                    </div>\
                </div>\
                </div>'

    } else if (v.tipo_campo==="geoy" || v.tipo_campo==="geox"){
        lis += '<div class="form-group" title="">\
                    <label class="col-sm-3 col-lg-3 control-label" for="'+divv+'">'+v.denominazione+':</label>\
                    <div class="col-sm-9 col-lg-9">\
                        <input class="form-control '+required+'" '+  value +' type="'+v.tipo_campo+'" name="'+divv+'" id="'+divv+'"/>\
                    </div>\
                </div>'
    } else if (v.denominazione==="nullo"){

    }else {
        lis += '<div class="form-group" title="">\
                    <label class="col-sm-3 col-lg-3 control-label" for="'+divv+'">'+v.denominazione+':</label>\
                    <div class="col-sm-6 col-lg-6">\
                        <input class="form-control '+required+'" '+  value +' type="'+v.tipo_campo+'" name="'+divv+'" id="'+divv+'"/>\
                    </div>\
                </div>'
     };
  });
     $("#generic").html(lis);
     $.each( data, function( k, v ){
         if (v.tipo_campo ==="Date") {
                $(".datapi").datepicker({ changeMonth: true, changeYear: true, dateFormat:"dd/mm/yy",});
                $(".datapi").datepicker( $.datepicker.regional[ "it" ] );
             };
         });

   }); //fine func getJson
}); //fine func change
$("#id_categoria").trigger( "change" )



});

</script>
